<template>
	<view class="content" >
		<form @submit="formSubmit" @reset="formReset" >
			<view class="uni-form-item uni-column">
				<view class="title">请输入你的小米运动账号</view>
				<input class="uni-input" type="number" name="Input" placeholder="账号一般为手机号哦" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">请输入你的密码</view>
				<input class="uni-input" password type="text" name="Password" placeholder="请输入小米运动密码" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">请输入你的步数</view>
				<input class="uni-input" maxlength="5" name="walk" placeholder="最大为5位数" />
			</view>
			<button class="mini-btn" form-type="submit">提交</button>
		</form>
	</view>
</template>

<script>
	//import {login} from '@/units/changestep.js'
	export default {
	        data() {
				Input: "";
				Password: "";
				walk: "";
	            return {
	            }
	        },
	        methods: {
	            formSubmit: function(e) {
					if(e.detail.value.Input.length==0||e.detail.value.Password.length==0||e.detail.value.walk.length==0){
						console.log('请完整输入' + JSON.stringify(e.detail.value))
						uni.showModal({
						    content: '输入信息不完整',
						    showCancel: true
						});
					}
					else{
						//console.log('数据发送成功，发送数据为：' + JSON.stringify(e.detail.value))
						var formdata = e.detail.value
						var phone = formdata.Input
						var pwd = formdata.Password
						var step = formdata.walk
						var url = 'https://service-9vdjr4dq-1304945650.gz.apigw.tencentcs.com/release/wechatstep'+'?'+'user='+phone+'&password='+pwd+'&step='+step
						//console.log(url)
						uni.request({
							url: url,
							method: 'GET',
							header: {
								"Content-Type": "application/json",
							},
							success: (res) => {
								//console.log(res.data);
								uni.showModal({
								    content: res.data,
								    showCancel: true
								});
							},
							fail: ()=>{
								uni.showModal({
								    content: '当前请求过多，请稍后再试',
								    showCancel: true
								});
							}
							
						})
						/*uni.request({
							url:'https://service-9vdjr4dq-1304945650.gz.apigw.tencentcs.com/release/wechatstep',
							data:{
								phone:phone,
								pwd:pwd,
								step:step
							},
							method:"POST",
							success: (res) => {
							    console.log(res.data);
							    this.text = 'request success';
							}
						})*/
						}
					}
	            }
	        }
	
</script>

<style>
	page{
		height: 100%;
		background-size:100% 100%;
		background-image: url("");
	}
	
	.mini-btn{
		position:relative;
		display:block;
		margin-top: 20px;
		margin-left:auto;
		margin-right:auto;
		padding-left:14px;
		padding-right:14px;
		box-sizing:border-box;
		font-size:36rpx;
		text-align:center;
		text-decoration:none;
		border-radius:5px;
		-webkit-tap-highlight-color:transparent;
		overflow:hidden;
		color:white;
		background-color:rgba(0,0,0,0.3);
		height: 80rpx;
		line-height: 80rpx;
		width:150rpx;
		cursor: pointer;
	}
	// 边框样式
	button::after{
		  border: 0;
	}
	// 禁用时样式
	button[disabled] {
		  background-color: #fff;
		  color: #666;
	}
	// 点击时样式
	.mini-btn:hover{
	      box-shadow: 0 0 10px rgba(0,0,0,0.5) inset;
	}
	/* 表单 */
	.uni-form-item{
		display:flex;
		width:100%;
		padding:10rpx 0;
		text-align: center;
	}
	.uni-column {
		flex-direction: column;
	}
	.uni-input {
		height: 50rpx;
		padding: 15rpx 25rpx;
		line-height:50rpx;
		font-size:28rpx;
		background:#FFF;
		flex: 1;
		border-bottom-style:solid;
		border-color:#00ecec;
		text-align: center;
		color: white;
		background: rgba(0,0,0,0.3);
	}
	.uni-form-item .title{
		padding:10rpx 25rpx;
		color: white;
	}
	.content{
		margin : 20px 10px 0px 10px;
		background: rgba(0,0,0,0.3);
		border-radius: 10px;
	    /*添加边距挤下去*/
		padding: 50px 0;
		box-sizing: border-box;
		/*添加阴影*/
		box-shadow: 0 0 5px 5px rgba(0,0,0,0.1);
	}
</style>
